<template>
  <div class="ome">
    <div class="fruit">
      <div class="fruit-photo">
        <img src="@/assets/images/apple.png" alt="">
      </div>
      <div class="fruit-list">
        <b>小西瓜每个约5斤</b>
        <span>月售100</span>
        <div class="fruit-price">
          <em>￥</em>
          <b>30</b>
          <!--      <span><van-icon size="18px" name="cart-o" /></span>-->
        </div>
      </div>
    </div>
    <div class="fruit">
      <div class="fruit-photo">
        <img src="@/assets/images/apple.png" alt="">
      </div>
      <div class="fruit-list">
        <b>小西瓜每个约5斤</b>
        <span>月售100</span>
        <div class="fruit-price">
          <em>￥</em>
          <b>30</b>
          <span><van-icon size="18px" name="cart-o"/></span>
        </div>
      </div>
    </div>
    <div class="fruit">
      <div class="fruit-photo">
        <img src="@/assets/images/apple.png" alt="">
      </div>
      <div class="fruit-list">
        <b>小西瓜每个约5斤</b>
        <span>月售100</span>
        <div class="fruit-price">
          <em>￥</em>
          <b>30</b>
          <span><van-icon size="18px" name="cart-o"/></span>
        </div>
      </div>
    </div>
    <div class="fruit">
      <div class="fruit-photo">
        <img src="@/assets/images/apple.png" alt="">
      </div>
      <div class="fruit-list">
        <b>小西瓜每个约5斤</b>
        <span>月售100</span>
        <div class="fruit-price">
          <em>￥</em>
          <b>30</b>
          <span><van-icon size="18px" name="cart-o"/></span>
        </div>
      </div>
    </div>
    <div class="fruit">
      <div class="fruit-photo">
        <img src="@/assets/images/apple.png" alt="">
      </div>
      <div class="fruit-list">
        <b>小西瓜每个约5斤</b>
        <span>月售100</span>
        <div class="fruit-price">
          <em>￥</em>
          <b>30</b>
          <!--          <span><van-icon size="18px" name="cart-o" /></span>-->
        </div>
      </div>
    </div>
    <div class="fruit">
      <div class="fruit-photo">
        <img src="@/assets/images/apple.png" alt="">
      </div>
      <div class="fruit-list">
        <b>小西瓜每个约5斤</b>
        <span>月售100</span>
        <div class="fruit-price">
          <em>￥</em>
          <b>30</b>
          <span><van-icon size="18px" name="cart-o"/></span>
        </div>
      </div>
    </div>
    <div class="fruit">
      <div class="fruit-photo">
        <img src="@/assets/images/apple.png" alt="">
      </div>
      <div class="fruit-list">
        <b>小西瓜每个约5斤</b>
        <span>月售100</span>
        <div class="fruit-price">
          <em>￥</em>
          <b>30</b>
          <span><van-icon size="18px" name="cart-o"/></span>
        </div>
      </div>
    </div>

  </div>
</template>

<script>
export default {
  name: "classFruit"
}
</script>

<style scoped lang="scss">
.ome {
  //flex: 1;
  padding-bottom: 60px;


  .fruit {
    display: flex;
    height: 100px;
    //margin-bottom: 0px;

    .fruit-photo {
      height: 80px;
      width: 30%;
    }

    .fruit-photo img {
      width: 100%;
      height: 100%;
      background-size: cover;
    }

    .fruit-list {
      display: flex;
      flex-direction: column;

      .fruit-price {
        margin-top: 10px;
      }

      .fruit-price span {
        //margin-left: 50px;
        padding-left: 100px;
      }
    }
  }

}
</style>